<template>
    <div class="enterprise_contract">
        <div class="head_title">签约设置</div>
       
        <div class="table_data">
            <el-table :data="tableData" border style="width: 100%" :header-cell-style="{background:'#f9f9f9'}">
                <el-table-column  type="index" label="序号" width="50"></el-table-column>
                <el-table-column  prop="facilitator_name" label="服务商名称" width="200"></el-table-column>
                <el-table-column  prop="protocol_start_time" label="协议开始日期" width="250"></el-table-column>
                <el-table-column  prop="protocol_end_time" label="协议终止日期" width="250"></el-table-column>
                <el-table-column  prop="standard_rate" label="标准充值费率" ></el-table-column>
                <el-table-column  label="签约协议" width="100">
                    <template slot-scope="scope">
                        <el-link :href="scope.row.protocol_img" target="_blank" v-if="scope.row.protocol_img != ''" >下载协议</el-link>
                    </template>
                </el-table-column>
                <el-table-column  label="查看费率" width="100">
                    <template slot-scope="scope">
                        <el-button type="text" @click="look(scope.row.enterprise_facilitator_id)">查看</el-button>
                        <el-dialog title="费率信息" :visible.sync="dialogTableVisible">
                            <span>标准费率：{{enterpriseRate.standard_rate}}</span>
                            <el-table :data="enterpriseRate.rate_list" v-if="enterpriseRate.region_type_name != '不累计'" :header-cell-style="{background:'#f9f9f9'}">
                                <el-table-column property="range" label="费率政策" width="300"></el-table-column>
                                <el-table-column property="region_rate" :label="enterpriseRate.region_type_name" ></el-table-column>
                            </el-table>
                            <el-table :data="enterpriseRate.do_logs" stripe :header-cell-style="{background:'#f9f9f9'}" v-if="enterpriseRate.do_logs.length > 0" >
                                <el-table-column property="facilitator_user_name" label="操作员" width="100"></el-table-column>
                                <el-table-column property="do_time" label="操作时间" width="200"></el-table-column>
                                <el-table-column property="content" label="描述" width="500"></el-table-column>
                            </el-table>
                        </el-dialog>

                    </template>
                </el-table-column>
            </el-table>
        </div>
    </div>
</template>





<script>
export default {
    name:"EnterpriseContract",
    data(){
        return{
            dialogTableVisible: false,  //是否打开查看费率弹窗
            enterpriseRate: {           //查看企业费率
                standard_rate:'',       //标准费率
                rate_list:[],           //阶梯费率
                do_logs:[],              //操作日志
                region_type_name: ''    //费率累计方式
            },         
            enterprise_id: 0,           //企业ID
            tableData:[]
            
        }
       
    },
    mounted() {
            this.enterprise_id = this.$route.query.enterprise_id;
            this.getSignList();
    },
    methods:{
        getSignList(){
            this.$raxios.post(this.$mapapi.enterpriseSignFacilitator,{data:{enterprise_id: this.enterprise_id}}).then(res => {
                if(res.code != 200 && res.msg != '暂无数据')     return  Promise.reject(res.msg);
                this.tableData = res.data;

            }).catch(res => {
                this.$message.error(res);
            });
        },
        loaddown(protocol_img){         //下载协议
            window.open(protocol_img);

            console.log('protocol_img', protocol_img);
        },
        look(enterprise_facilitator_id){        //查看费率
            this.dialogTableVisible = true;
            this.$raxios.post(this.$mapapi.enterpriseRate,{data:{enterprise_facilitator_id}}).then(res => {
                console.log('look', res);
                if(res.code != 200)     return  Promise.reject(res.msg);
                this.enterpriseRate = res.data;
                if(this.enterpriseRate.rate_list.length > 0){
                    for(let val of this.enterpriseRate.rate_list){      //将阶梯费率起始、结束金额做成合成一个字段 range
                    val.range = val.money_region_start + '~' + val.money_region_end;
                    }
                }
            }).catch(res => {
                this.$message.error(res);
            });
            console.log('enterprise_facilitator_id', enterprise_facilitator_id);
        }

    }
}
</script>
<style lang="less" :scope="true">
    .enterprise_contract{
        padding: 0;
        background: #fff;
        font-size: 14px;

        .head_title{
            width: 70px;
            text-align: right;
            border-left: 2px solid #4280f2;
            
        }
        
        .table_data{
            padding: 20px 0 80px 0
        }

    }

</style>